<template>
  <view>
    <view>swiper滑动视图</view>
    <swiper :indicator-dots="showdots" :autoplay="auto" :interval="interval" duration="duration">
      <swiper-item>
        <view class="bg-blue item">A</view>
      </swiper-item>
      <swiper-item>
        <view class="bg-green item">B</view>
      </swiper-item>
      <swiper-item>
        <view class="bg-red item">C</view>
      </swiper-item>
    </swiper>
  </view>
</template>

<script>
export default {
  data() {
    return {
      showdots: true,
      auto: true,
      interval: 5000,
      duration: 500
    }
  },
  methods: {}
}
</script>

<style>
	.item {
		height:800upx;		
	}
	.bg-blue {
		background-image: url(../../../static/1.jpg);
	}
	.bg-green {
		background-image: url(../../../static/2.jpg);
	}
	.bg-red {
		background-image: url(../../../static/3.jpg);
	}
</style>
